<template>
	<view>
		<view v-if="!loading">
			<view class="cu-form-group">
				<view class="title">* 企业名称</view>
				<input placeholder="请输入企业名称" name="input" v-model="name" class="text-r"></input>
			</view>
			<view class="cu-form-group">
				<view class="title">企业简称</view>
				<input placeholder="请输入企业简称" name="input" v-model="simple_name" class="text-r"></input>
			</view>
			<view class="cu-form-group">
				<view class="title">* 联系人</view>
				<input placeholder="请输入企业联系人" name="input" v-model="contacts" class="text-r"></input>
			</view>
			<view class="cu-form-group">
				<view class="title">联系电话</view>
				<input placeholder="请输入联系电话" name="input" v-model="contact_tel" class="text-r" type="number"></input>
			</view>
			<view class="cu-form-group">
				<view class="title">联系邮箱</view>
				<input placeholder="请输入企业邮箱" name="input" v-model="email" class="text-r"></input>
			</view>
			<view class="form-item cu-form-group">
				<view class="title">* 行业类型</view>
				<picker @change="businessChange" :value="index1" :range="business" range-key="name">
					<view class="picker">
						{{businessTypeCount}}
					</view>
				</picker>
			</view>
			<view class="form-item cu-form-group">
				<view class="title">* 客户状态</view>
				<picker @change="companyTypeChange" :value="index" :range="companyType" range-key="name">
					<view class="picker">
						{{companyTypeCount}}
					</view>
				</picker>
			</view>
			<view class="form-item cu-form-group">
				<view class="title">* 客户级别</view>
				<picker @change="companyLevelChange" :value="index2" :range="companyLevel" range-key="name">
					<view class="picker">
						{{companyLevelCount}}
					</view>
				</picker>
			</view>
			<view class="form-item cu-form-group">
				<view class="title">* 渠道来源</view>
				<picker @change="companyChannelChange" :value="index3" :range="companyChannel" range-key="name">
					<view class="picker">
						{{companyChannelCount}}
					</view>
				</picker>
			</view>
			<view class="form-item cu-form-group">
				<view class="title">销售负责人</view>
				<picker @change="saleUserChange" :value="index4" :range="saleUser" range-key="name">
					<view class="picker">
						{{saleUserCount}}
					</view>
				</picker>
			</view>
			<view class="form-item cu-form-group">
				<view class="title">服务负责人</view>
				<picker @change="servicesUserChange" :value="index5" :range="servicesUser" range-key="name">
					<view class="picker">
						{{servicesUserCount}}
					</view>
				</picker>
			</view>
			<view class="cu-form-group">
				<view class="title">地址选择</view>
				<mpvue-city-picker :themeColor="themeColor" ref="mpvueCityPicker" :pickerValueDefault="cityPickerValueDefault"
				 @onCancel="onCancel" @onConfirm="onConfirm" />
				<view @tap="showMulLinkageThreePicker" class="address-sty">{{adress?adress:"请选择"}}</view>
			</view>
			<view class="cu-form-group">
				<view class="title">街道地址</view>
				<input placeholder="请输入详细地址" name="input" v-model="address" class="text-r"></input>
			</view>

			<view class="flex btm-btn-box">
				<view class="btn-yes flex flex-1 ccc" @tap="handleClickConfirm">确定</view>
			</view>
		</view>
		<Loading v-else />
	</view>
</template>

<script>
	import mpvueCityPicker from '../../components/mpvue-citypicker/mpvueCityPicker.vue'
	import provinceData from '../../components/mpvue-citypicker/city-data/province.js';
	import cityData from '../../components/mpvue-citypicker/city-data/city.js';
	import areaData from '../../components/mpvue-citypicker/city-data/area.js';
	import Loading from '../../components/common/loading.vue'
	export default {
		components: {
			// mpvuePicker,
			mpvueCityPicker,
			Loading,
		},
		data() {
			return {
				loading: true,
				cityPickerValueDefault: [0, 0, 0],
				// cityPickerValueDefault: [3, 4, 3],
				themeColor: '#007AFF',
				pickerText: '',
				// mulLinkageTwoPicker: cityData,
				id: '',
				msg: '', //错误提示
				token: '',
				// 行业
				business: [],
				index1: 0,
				businessname: '',
				// 客户状态
				companyType: [],
				index: 0,
				companyTypeName: '',
				// 客户级别
				companyLevel: [],
				index2: 0,
				companyLevelName: '',
				// 渠道来源
				companyChannel: [],
				index3: 0,
				companyChannelName: '',
				// 销售负责人
				saleUser: [],
				index4: 0,
				saleUserName: '',
				// 服务负责人
				servicesUser: [],
				index5: 0,
				servicesUserName: '',
				// 地址
				region: [],
				adress: '',
				// 往后台传的数据
				name: '', //企业名称
				simple_name: '', //企业简称
				contacts: '', //联系人
				contact_tel: '', //联系人电话
				email: '', //联系人邮箱
				business_id: '', //行业id
				companyType_id: '', //客户状态id
				companyLevel_id: '', //客户级别id
				companyChannel_id: '', //渠道来源id
				saleUser_id: '', //销售负责人
				servicesUser_id: '', //服务负责人
				address: '', //详细地址
			}
		},

		computed: {
			// 行业类型
			businessTypeCount() {
				if (this.businessname) {
					return this.businessname
				} else {
					return this.index1 > 0 ? this.business[this.index1].name : '请选择'
				}
			},
			// 客户状态
			companyTypeCount() {
				if (this.companyTypeName) {
					return this.companyTypeName
				} else {
					return this.index > 0 ? this.companyType[this.index].name : '请选择'
				}
			},
			// 客户级别
			companyLevelCount() {
				if (this.companyLevelName) {
					return this.companyLevelName
				} else {
					return this.index2 > 0 ? this.companyLevel[this.index2].name : '请选择'
				}
			},
			// 渠道来源
			companyChannelCount() {
				if (this.companyChannelName) {
					return this.companyChannelName
				} else {
					return this.index3 > 0 ? this.companyChannel[this.index3].name : '请选择'
				}
			},
			// 销售负责人
			saleUserCount() {
				if (this.saleUserName) {
					return this.saleUserName
				} else {
					return this.index4 > 0 ? this.saleUser[this.index4].name : '请选择'
				}
			},
			// 服务负责人
			servicesUserCount() {
				if (this.servicesUserName) {
					return this.servicesUserName
				} else {
					return this.index5 > 0 ? this.servicesUser[this.index5].name : '请选择'
				}
			}
		},
		async onLoad(option) {
			await this.getUser();
			await this.getSearchWhere();
			if (option.id) {
				// console.log(option.id)
				let listId = option.id
				this.requestCompanyInfo(listId);
			} else {
				this.loading = false;
			}
		},
		methods: {
			onCancel(e) {
				// console.log(e)
			},
			// 三级联动选择
			showMulLinkageThreePicker() {
				this.$refs.mpvueCityPicker.show()
			},
			onConfirm(e) {
				this.pickerText = JSON.stringify(e)
				// console.log(this.pickerText)
				// console.log(e.label)
				this.adress = e.label;
				// console.log(e.label.split('-'))
				this.region = e.label.split('-')
			},
			// 取token
			getToken() {
				try {
					const value = uni.getStorageSync('login_key');
					if (value) {
						this.token = value;
					}
				} catch (e) {
					// error
				}
			},
			// 搜索行业
			businessChange(e) {
				this.businessname = '';
				uni.hideKeyboard();
				this.index1 = e.detail.value
				this.business_id = this.business[this.index1].id
				// console.log(this.business_id)
			},
			// 搜索客户状态
			companyTypeChange(e) {
				this.companyTypeName = '';
				uni.hideKeyboard();
					this.index = e.detail.value
				this.companyType_id = this.companyType[this.index].id
			},
			// 搜索客户级别
			companyLevelChange(e) {
				this.companyLevelName = '';
				uni.hideKeyboard();
					this.index2 = e.detail.value
				this.companyLevel_id = this.companyLevel[this.index2].id
			},
			// 搜索渠道来源
			companyChannelChange(e) {
				this.companyChannelName = '';
				uni.hideKeyboard();
					this.index3 = e.detail.value
				this.companyChannel_id = this.companyChannel[this.index3].id
			},
			// 销售负责人
			saleUserChange(e) {
				this.saleUserName = '';
				uni.hideKeyboard();
					this.index4 = e.detail.value
				this.saleUser_id = this.saleUser[this.index4].id
			},
			// 服务负责人
			servicesUserChange(e) {
				this.servicesUserName = '';
				uni.hideKeyboard();
					this.index5 = e.detail.value
				this.servicesUser_id = this.servicesUser[this.index5].id
			},
			// 点取消返回上一页
			handleClickCancel() {
				uni.navigateBack({
					delta: 1,
					animationType: 'pop-out',
					animationDuration: 200
				});
			},
			// 点确定提交数据
			async handleClickConfirm() {
				var pages = getCurrentPages();
				var currPage = pages[pages.length - 1]; //当前页面
				var prevPage = pages[pages.length - 2]; //上一个页面
				//直接调用上一个页面的setData()方法，把数据存到上一个页面中去
				prevPage && prevPage.setData && prevPage.setData({
					isDoRefresh: true
				});
				// 发请求
				let url = this.ServicesApi.companyCreateEdit;
				let data = {
					name: this.name, //企业名称
					simple_name: this.simple_name, //企业简称
					contacts: this.contacts, //联系人
					contact_tel: this.contact_tel, //联系人电话
					email: this.email, //联系人邮箱
					business_type_id: this.business_id, //行业类型
					company_type_id: this.companyType_id, //客户状态
					company_level_id: this.companyLevel_id, //客户级别
					company_channel_id: this.companyChannel_id, //渠道来源
					sale_user_id: this.saleUser_id, //销售负责人
					services_user_id: this.servicesUser_id, //服务负责人
					province: this.region[0], //省
					city: this.region[1], //市
					area: this.region[2], //区
					addr: this.address, //街道地址
					id: this.id || '', //如果有这个参数，表示这个是修改而不是新增
				};
				let result = await this.Services.post(url, data);
				if (result.code == this.StatusCode.SUCCESS_CODE) {
					uni.showToast({
						icon: 'none',
						title: result.msg,
					});
					uni.navigateBack({
						delta: 1,
						animationType: 'pop-out',
						animationDuration: 200
					});
				} else {
					uni.showToast({
						icon: 'none',
						title: result.msg,
					});
				}
			},
			// 请求条件
			async getSearchWhere() {
				this.getToken()
				// 发请求
				let url = this.ServicesApi.searchWhere;
				let data = {
				    limit: 50,
				    page: this.page,
				    name: this.name,//岗位类型名称
				};
				let result = await this.Services.post(url, data);
				if (result.code == this.StatusCode.SUCCESS_CODE) {
					this.business = result.data.business_type;
					this.companyType = result.data.company_type;
					this.companyLevel = result.data.company_level;
					this.companyChannel = result.data.company_channel;
				}
				
				// uni.request({
				// 	url: this.ServicesApi.searchWhere,
				// 	method: 'POST',
				// 	header: {
				// 		"content-type": "application/x-www-form-urlencoded"
				// 	},
				// 	data: {
				// 		token: this.token,
				// 		num: 0,
				// 	},
				// 	success: (res) => {
				// 		// console.log(res.data.data)
				// 		this.business = res.data.data.business_type;
				// 		this.companyType = res.data.data.company_type;
				// 		this.companyLevel = res.data.data.company_level;
				// 		this.companyChannel = res.data.data.company_channel;
				// 	}
				// });
			},
			// 请求负责人
			async getUser() {
				this.getToken()
				// 发请求
				let url = this.ServicesApi.userList;
				let data = {
				    limit: 50,
				    page: this.page,
				    name: this.name,//岗位类型名称
				};
				let result = await this.Services.post(url, data);
				if (result.code == this.StatusCode.SUCCESS_CODE) {
				    this.saleUser = result.data;
				    this.servicesUser = result.data;
				}
				
				// uni.request({
				// 	url: this.ServicesApi.userList,
				// 	method: 'POST',
				// 	header: {
				// 		"content-type": "application/x-www-form-urlencoded"
				// 	},
				// 	data: {
				// 		token: this.token,
				// 	},
				// 	success: (res) => {
				// 		// console.log('负责人',res.data.data)
				// 		this.saleUser = res.data.data;
				// 		this.servicesUser = res.data.data;
				// 	},
				// });
			},
			async requestCompanyInfo(listId) {
				// 发请求
				let url = this.ServicesApi.companyDetail;
				let data = {
						id: listId
				};
				let result = await this.Services.post(url, data);
				if (result.code == this.StatusCode.SUCCESS_CODE) {
				    // console.log("请求得数据有吗？",res.data.data)
				    let list = result.data;
				    this.name = list.name; //企业名称
				    this.simple_name = list.simple_name; //企业简称
				    this.contacts = list.contacts; //联系人
				    this.contact_tel = list.contact_tel; //联系人电话
				    this.email = list.email; //联系人邮箱
				    this.business_id = list.business_type_id; //行业id
				    this.businessname = list.business_type_name;
				    this.companyType_id = list.company_type_id; //客户状态id
				    this.companyTypeName = list.company_type_name;
				    this.companyLevel_id = list.company_level_id; //客户级别id
				    this.companyLevelName = list.company_level_name;
				    this.companyChannel_id = list.company_channel_id; //渠道来源id
				    this.companyChannelName = list.company_channel_name;
				    this.saleUser_id = list.sale_user_id; //销售负责人
				    this.saleUserName = list.sale_user_name,
				    	this.servicesUser_id = list.services_user_id; //服务负责人
				    this.servicesUserName = list.services_user_name;
				    this.address = list.addr; //详细地址
				    this.region = list.p_c_a;
				    this.adress = list.p_c_a.join('-');
				    this.id = list.id;
				    setTimeout(() => {
				    	let index = this.companyType.findIndex(i => i.id == this.companyType_id);
				    	let index1 = this.business.findIndex(i => i.id == this.business_id);
				    	let index2 = this.companyLevel.findIndex(i => i.id == this.companyLevel_id);
				    	let index3 = this.companyChannel.findIndex(i => i.id == this.companyChannel_id);
				    	let index4 = this.saleUser.findIndex(i => i.id == this.saleUser_id);
				    	let index5 = this.servicesUser.findIndex(i => i.id == this.servicesUser_id);
				    	this.index = index > -1 ? index : 0;
				    	this.index1 = index1 > -1 ? index1 : 0;
				    	this.index2 = index2 > -1 ? index2 : 0;
				    	this.index3 = index3 > -1 ? index3 : 0;
				    	this.index4 = index4 > -1 ? index4 : 0;
				    	this.index5 = index5 > -1 ? index5 : 0;
				    	let province_index = provinceData.findIndex(i => i.label == list.province) > -1 ? provinceData.findIndex(i =>
				    		i.label == list.province) : 0;
				    	let city_index = cityData[province_index].findIndex(i => i.label == list.city) > -1 ? cityData[
				    		province_index].findIndex(i => i.label == list.city) : 0;
				    	let area_index = areaData[province_index][city_index].findIndex(i => i.label == list.area) > -1 ? areaData[
				    		province_index][city_index].findIndex(i => i.label == list.area) : 0;
				    	this.cityPickerValueDefault = [province_index, city_index, area_index];
				    	// this.cityPickerValueDefault = [3, 4, 3];
				    	console.log('this.cityPickerValueDefault---->', this.cityPickerValueDefault);
				    	console.log('this.index---->', this.index, this.companyType_id);
				    	console.log('this.index1---->', this.index1, this.business_id);
				    	console.log('this.index2---->', this.index2, this.companyLevel_id);
				    	console.log('this.index3---->', this.index3, this.companyChannel_id);
				    	console.log('this.index4---->', this.index4, this.saleUser_id);
				    	console.log('this.index5---->', this.index5, this.servicesUser_id);
						this.loading = false;
				    }, 200);
				} else {
					this.loading = false;
				}
			}
		},
		mounted() {
			// this.getSearchWhere();
			// this.getUser();
		}
	}
</script>

<style scoped lang="stylus">
	// .teshu{
	// 	height:300upx;
	// 	position:absolute;
	// 	z-index:30000
	// }
	.address-sty {
		font-size: 30upx;
		color: #666;
		min-width: 450upx;
		text-align: right;

	}

	.msg {
		height: 40upx;
		font-size 28upx;
		color: red;
	}

	.btm-btn-box {
		justify-content space-around;
		height: 100upx;
		margin: 80upx 20upx 80upx;

		.btn-yes {
			margin: 60rpx;
			height: 100upx;
			line-height: 100upx;
			text-align: center;
			background: #0081FF;
			border-right: 1upx solid #8799A3;
			color: #fff
		}

		.btn-no {
			height: 100upx;
			width: 300upx;
			line-height: 100upx;
			text-align: center;
			background: #0081FF;
			color: #fff
		}
	}
</style>
